<script setup>
import {defineProps} from "vue";
import {inject} from "vue";
import {edit} from "../../../apis/item";
import {plus} from "../../../apis/item";
import {plusFiles} from "../../../apis/files";

/**
 * 自定义属性 ：只读
 * @type {Prettify<Readonly<ExtractPropTypes<{visible: BooleanConstructor}>>>}
 */

const props=defineProps({
  title: String,
  formData:Object

})
/**
 * 注入父组件中传入的值
 * @type {unknown}
 */
const dialogVisible=inject('dialogVisible')
const isSuccess=inject('isSuccess')

const save = () =>{
  if(props.title == '修改'){
    // console.log(props.formData)
    edit(props.formData).then(()=>{
      dialogVisible.value=false
      isSuccess.value=true
    })
  }else if(props.title == '新增'){
     plus(props.formData).then(()=>{
       dialogVisible.value=false
       isSuccess.value=true
     })
  }



}

const handleImgUploadSuccess = (result) =>{
  console.log(result)
  props.formData.image=result.data
  // console.log(props.formData.image)
  setTimeout(() => {
        console.log(props.formData.image);
      }, 10000);

}
//
// const handleImgUploadSuccess = (result) => {
//   console.log("Received result:", result); // 打印完整的响应对象
//   try {
//     if (result && result.data) {
//       props.formData.image = result.data;
//       console.log("formData.image updated to:", props.formData.image);
//     } else {
//       console.warn("Unexpected result structure. Missing 'data' property.");
//     }
//   } catch (error) {
//     console.error("Error processing the upload result:", error);
//   }
// };
// const handleImgUploadSuccess = () =>{
//   console.log(props.formData)
// }

</script>


<template>
  <el-dialog :title="props.title" width="500" align-center destroy-on-close v-model="dialogVisible">
    <el-form>
      <el-form-item label="球鞋名称">
      <el-input v-model="props.formData.itemName"/>
    </el-form-item>
      <el-form-item label="球鞋编码">
        <el-input v-model="props.formData.code"/>
      </el-form-item>
      <el-form-item label="球鞋品牌ID">
        <el-input v-model="props.formData.brandId"/>
      </el-form-item>
      <el-form-item>
<!--        http://localhost:8081/files/upload-->
        <el-upload action="http://localhost:8081/files/upload " list-type="picture" :on-success="handleImgUploadSuccess">
          <el-button>上传图片</el-button>
        </el-upload>
      </el-form-item>
<!--      <el-form-item label="球鞋图片">-->
<!--        <el-input v-model="props.formData.image"/>-->
<!--      </el-form-item>-->
    </el-form>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="save">
          保存
        </el-button>
      </div>
    </template>
  </el-dialog>


</template>


<style scoped>

</style>